
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String contextPath = request.getContextPath();
%>

<!DOCTYPE html>
<!--[if IE 8]>         <html class="ie8"> <![endif]-->
<!--[if IE 9]>         <html class="ie9 gt-ie8"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="gt-ie8 gt-ie9 not-ie"> <!--<![endif]-->
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>Sign In - CCHR Management System</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">

	<!-- Open Sans font from Google CDN -->

	<!-- Pixel Admin's stylesheets -->
	<link href="<%=contextPath%>/assets/stylesheets/bootstrap.min.css" rel="stylesheet" type="text/css">
	<link href="<%=contextPath%>/assets/stylesheets/pixel-admin.min.css" rel="stylesheet" type="text/css">
	<link href="<%=contextPath%>/assets/stylesheets/pages.min.css" rel="stylesheet" type="text/css">
	<link href="<%=contextPath%>/assets/stylesheets/rtl.min.css" rel="stylesheet" type="text/css">
	<link href="<%=contextPath%>/assets/stylesheets/themes.min.css" rel="stylesheet" type="text/css">

	<!--[if lt IE 9]>
		<script src="<%=contextPath%>/assets/javascripts/ie.min.js"></script>
	<![endif]-->


<!-- $DEMO =========================================================================================

	Remove this section on production
-->
	<style>
		#signin-demo {
			position: fixed;
			right: 0;
			bottom: 0;
			z-index: 10000;
			background: rgba(0,0,0,.6);
			padding: 6px;
			border-radius: 3px;
		}
		#signin-demo img { cursor: pointer; height: 40px; }
		#signin-demo img:hover { opacity: .5; }
		#signin-demo div {
			color: #fff;
			font-size: 10px;
			font-weight: 600;
			padding-bottom: 6px;
		}
	</style>
<!-- / $DEMO -->

</head>


<!-- 1. $BODY ======================================================================================
	
	Body

	Classes:
	* 'theme-{THEME NAME}'
	* 'right-to-left'     - Sets text direction to right-to-left
-->
<body class="theme-default page-signin">

<script>
	var init = [];
</script>
	<!-- Page background -->
	<div id="page-signin-bg">
		<!-- Background overlay -->
		<div class="overlay" style="background:rgba(0, 0, 0, 0) none repeat scroll 0 0"></div>
		<!-- Replace this with your bg image -->
		<img src="<%=contextPath%>/assets/images/themes/home-bg.jpg">
	</div>
	<!-- / Page background -->

	<!-- Container -->
	<div class="signin-container" style="width:400px;height:100px; margin-top:170px;">

		<!-- Right side -->
		<div class="tmp" style="padding:10px 10px; border:1px solid #fff; border-radius:20px; ">
			<div class="signin-form" style="background:#dff0ff; padding:10px 10px 10px 10px;  border-radius:14px;">
				<!-- Form -->
				<form action="<%=contextPath%>/user/login" method="POST"  id="signin-form_id">
					<center><img src="<%=contextPath%>/assets/images/case/logo.png" style="max-width: 50px; dispaly:bolock; margin:0px 0 0 0px;"> <font size="4px" color="#488abc"><B>&nbsp;&nbsp;&nbsp;CCHR Management System</B></font></center>
					<center><table style="width:100%;text-align:center;font-size:16px;"><tr><td><B></B></td></tr></table></center>
					
					<br>
					<div class="form-group">
					    <span ><font color="red"><%=request.getAttribute("email_error_msg")==null?"":(request.getAttribute("email_error_msg").toString())%></font></span>
					    <div class="input-group">
					     <!-- class="input-group-addon" -->
					        <span style=" margin-left:10px;font-size: 14px; color:#2483ca; backrgound:#afd7fc; display:block; float:left; width:90px;line-height:40px;">User Name<!-- <i class="glyphicon glyphicon-envelope"></i> --></span>
					        <input type="text" name="signin_email" id="email_id" class="form-control input-lg" style="width:240px;dispaly:block; height:36px; float:right; border:none; border:2px solid #afd7fc; border-radius:4px;">
					      </div>
					</div> <!-- / Username -->
			
					<div class="form-group signin-password">
					    <span><font color="red"><%=request.getAttribute("password_error_msg")==null?"":(request.getAttribute("password_error_msg").toString())%></font></span>
					    <div class="input-group">
					     <!-- class="input-group-addon" -->
					        <span style=" margin-left:10px;font-size: 14px; color:#2483ca; backrgound:#afd7fc; display:block; float:left; width:90px; line-height:40px;">Password<!-- <i class="glyphicon glyphicon-lock"></i> --></span>
					        <input type="password" name="signin_password" id="password_id" class="form-control input-lg" style="width:240px;dispaly:block;height:36px;  float:right; border:none; border:2px solid #afd7fc; border-radius:4px;">
					      </div>
					</div> <!-- / Password -->
					<br>
					<span style="position:relative;"><font color="red" style="display:block; float:left; position:absolute; top:-12px; right:-160px; "><%=request.getAttribute("error_msg")==null?"":request.getAttribute("error_msg").toString()%></font></span>
					<table style="width:100%"><tr><td style="width:70%"><a href="<%=contextPath%>/user/getPassword" class="forgot" style="color:#488abc; margin-left:10px;">Forgot Password?</a></td><td style="width:30%"><input type="submit" class="btn btn-primary1" style="border-radius:10px;color:white;background:#f18d3b;width:100px; height:30px; font-size:20px; margin-right:30px;" value="SIGN IN"/></td></tr></table>
				</form>
				<!-- / Form -->
	
				<!-- "Sign In with" block -->
				<!-- / "Sign In with" block -->
	
				<!-- Password reset form -->
				<div class="password-reset-form" id="password-reset-form">
					<div class="header">
						<div class="signin-text">
							<span>Password reset</span>
							<div class="close">&times;</div>
						</div> <!-- / .signin-text -->
					</div> <!-- / .header -->
					
					<!-- Form -->
					<form action="index.html" id="password-reset-form_id">
						<div class="form-group w-icon">
							<input type="text" name="password_reset_email" id="p_email_id" class="form-control input-lg" placeholder="Enter your email">
							<span class="fa fa-envelope signin-form-icon"></span>
						</div> <!-- / Email -->
	
						<div class="form-actions">
							<input type="submit" value="SEND PASSWORD RESET LINK" class="signin-btn bg-primary">
						</div> <!-- / .form-actions -->
					</form>
					<!-- / Form -->
				</div>
				<!-- / Password reset form -->
			</div>
		</div>
		<!-- Right side -->
	</div>
	<!-- / Container -->

<!-- Get jQuery from Google CDN -->
<!--[if !IE]> -->
	<script type="text/javascript"> window.jQuery || document.write('<script src="<%=contextPath%>/assets/javascripts/jquery-2.0.3.min.js">'+"<"+"/script>"); </script>
<!-- <![endif]-->
<!--[if lte IE 9]>
	<script type="text/javascript"> window.jQuery || document.write('<script src="<%=contextPath%>/assets/javascripts/jquery-1.8.3.min.js">'+"<"+"/script>"); </script>
<![endif]-->


<!-- Pixel Admin's javascripts -->
<script src="<%=contextPath%>/assets/javascripts/bootstrap.min.js"></script>
<script src="<%=contextPath%>/assets/javascripts/pixel-admin.min.js"></script>

<script type="text/javascript">
	// Resize BG
	init.push(function () {
		var $ph  = $('#page-signin-bg'),
		    $img = $ph.find('> img');

		$(window).on('resize', function () {
			$img.attr('style', '');
			if ($img.height() < $ph.height()) {
				$img.css({
					height: '100%',
					width: 'auto'
				});
			}
		});
	});

	// Show/Hide password reset form on click
	init.push(function () {
		$('#forgot-password-link').click(function () {
			$('#password-reset-form').fadeIn(400);
			return false;
		});
		$('#password-reset-form .close').click(function () {
			$('#password-reset-form').fadeOut(400);
			return false;
		});
	});

	// Setup Sign In form validation
	init.push(function () {

		$("#signin-form_id").validate({
			ignore: '.ignore',
			focusInvalid: true,
			rules: {
				'signin_email': {
					required: true,
					minlength: 3
				},
				'signin_password': {
					required: true,
					minlength: 6
				},
			}
		});
		
	});

	// Setup Password Reset form validation
	init.push(function () {
		$("#password-reset-form_id").validate({ focusInvalid: true, errorPlacement: function () {} });
		
		// Validate email
		$("#p_email_id").rules("add", {
			required: true,
			email: true
		});
	});

	window.PixelAdmin.start(init);
</script>

</body>
</html>